﻿/*
滚动监听插件版源码；无论是监听body整个页面，还是监听页面中某个容器，都可以用；电脑、手机端通用JJYChengScrollListening.js
作者：cplvfx
博客地址：https://cplvfx.blog.csdn.net/
更新时间：2024-3-6
*/
window.JJYChengScrollListeningFun = function (obj) {
    // console.log(this)
    // console.log(obj)
    var domObj = document.body;//获取对象
    var ListenerObj = window;
    var IsListenerBody=true;//是否监听Body
    if (typeof (obj) != 'object') {
        obj = {
            domIdName: '',
            distance: 10,//距离底部多少开始加载
            IsDisabled: false,//是否停止
            CallBackFun: null,//回调方法
        };
    } 
    //Dom名称
    if (obj.domIdName != '' && obj.domIdName != undefined) {
        domObj = document.querySelector("#" + obj.domIdName);//获取监听对象
        // console.log('45465',domObj)
        ListenerObj = domObj;//监听对象
        IsListenerBody=false;//是否监听Body
    }
    else {
        obj.domIdName = '';
    }
    //距离
    if (typeof (obj.distance) != 'number') {
        obj.distance = 10;
    }
    //停止
    if (typeof (obj.IsDisabled) != 'boolean') {
        obj.IsDisabled = false;
    }
    //回调
    if (typeof (obj.CallBackFun) != 'function') {
        obj.CallBackFun = null;
    }
    // console.log('参数对象obj==', obj);
    // console.log('domObj==', domObj);

    // debugger
    // console.log('参数对象obj==',typeof(obj),obj);
    // console.log('距离obj.distance==',typeof(obj.distance),obj.distance);
    // console.log('停止obj.IsDisabled==',typeof(obj.IsDisabled),obj.IsDisabled);
    // console.log('回调obj.CallBackFun==',typeof(obj.CallBackFun),obj.CallBackFun);

     
    //添加滚动监听事件-start
    ListenerObj.addEventListener('scroll', function () {
        // console.log('添加滚动监听事件')
        handleScrollFun();
    });
    //添加滚动监听事件-end

    /*处理滚动--start*/
    function handleScrollFun() {
        // console.log('处理滚动.........')
        

        //变量scrollTop是滚动条滚动时，距离顶部的距离 
        var scrollTop = 0;
        //变量windowHeight是可视区的高度
        var windowHeight =0;
        //变量scrollHeight是滚动条的总高度
        var scrollHeight =0;
        // 滚动条偏移量 
        let offset = 0;
        
        //监听的Body
        if(IsListenerBody==true)
        {
            scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
            windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
            scrollHeight = document.documentElement.scrollHeight || document.body.scrollHeight;
            offset = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop;
        }
        else
        {
            scrollTop = domObj.scrollTop;
            windowHeight = domObj.clientHeight;
            scrollHeight = domObj.scrollHeight;
            offset= domObj.scrollTop;
        }
    

        // console.warn('滚动条距离顶部的距离scrollTop==', scrollTop); 
        // console.log('窗口可视区的高度windowHeight==',windowHeight);
        // console.log('滚动条的总高度scrollHeight==',scrollHeight);
        // console.log('滚动条偏移量offset==',offset);
       
        //计算总高度
        var CountHeight = (scrollTop + windowHeight);
        //计算底部距离(滚动条距离底部的距离)
        var bottomDistance=(scrollHeight-(scrollTop + windowHeight));
        //console.log('底部距离=' + bottomDistance);
        
        // console.warn('this==',this) 
        //  console.error('、、、、、、、、obj.IsDisabled==',obj.IsDisabled) 
        //滚动条到底部的条件
        if (bottomDistance<=obj.distance&&obj.IsDisabled==false) {
            // console.log('滚动高度+窗口高度=' + scrollTop + windowHeight);
            
            if (typeof (obj.CallBackFun) == 'function' && obj.IsDisabled == false) {
                var resObj = {
                    scrollTop,
                    windowHeight,
                    scrollHeight,
                    offset,
                    bottomDistance
                }
                return obj.CallBackFun(resObj);
            }
        }
    }
    /*处理滚动--end*/

    obj.SetIsDisabled=function(val)
    {
        // console.error('typeof (val) ==',typeof (val) )
        // console.error('this==',this)
        // console.error('val==',val)
        if (typeof (val) == 'boolean') {
            this.IsDisabled = val;
            // console.error('if--this.IsDisabled==',this.IsDisabled)
            // console.error('if--this==',this)
        }
        else
        {
            this.IsDisabled = true;//禁用
            // console.error('else--this.IsDisabled',this.IsDisabled)
            // console.error('else--this==',this)
        }
    }
    return obj;
} 
